<template>
  <element1x1 :pop="pop"
              v-loading="loading"
              :element-loading-text="loadingText"
              element-loading-spinner="el-icon-warning-outline"
              element-loading-background="rgba(0, 0, 0, 0.6)">
    <slot slot="close"></slot>
    <div class="con" slot="content">
      <h3 style="font-size: 18px;margin-top: 26px">{{male}}（男）：{{female}}（女）</h3>
      <p class="sum-p">
        <span class="leftspan" >男生总数：</span>
        <span class="rightspan">
           {{male_enters}}人
          </span>
        <span  class="leftspan" >女生总数：</span>
        <span  class="rightspan">
          {{female_enters}}人
          </span>
      </p>
    </div>

  </element1x1>
</template>
<style lang="scss">

</style>
<script>
  let moment = require("moment");
  import element1x1 from "@/components/real-time/real-time-module/common/size/Element1x1";
  export default {
    components: {
      element1x1:element1x1
    },
    props: {
      GetData:{},
      isdemo:{
        type:Boolean,
        default:function(){
          return false
        }
      }
    },
    data(){
      return {
        pop:{
          title: "男女比例",							//报表标题
          helphint:[
            {title:"男女比例",text:""},				//第一条信息为提示标题 不给text
          ]
        },
        realData:{
          company_ids:'',//企业id
          case_ids:'',//案场id
          idsType:0,//企业或案场标记：0：为只选择了企业id，1：为选择了案场id
          start_day:moment(new Date()).format("YYYY-MM-DD"),
          end_day:moment(new Date()).format("YYYY-MM-DD"),
        },
        loading:false,
        loadingText:'加载中...',
        start_hm:'00:00',
        end_hm:'23:59',
        global:null,
        org_type:null,
        male:'',
        female:'',
        male_enters:'',
        female_enters:'',
        shake:false,
      }
    },
    created() {
      if(this.isdemo){
        this.male = '50'
        this.female = '50'
        this.male_enters = '8888'
        this.female_enters = '8888'
        this.loading=false;
      }
    },
    mounted() {
    },
    beforeDestroy(){},
    methods: {
      getData(){
        let params={};
        let tags=0;
        if(this.global.type=='chain') {
          tags=2;
        } else if(this.global.type=='mall') {
          tags=1;
        }
        let group_type='';
        if(this.realData.idsType){ //0企业 1案场
          params = {
            org_id_list : this.realData.case_ids.split(","),
            org_type:2,
          }
          group_type='case';
        }
        else{
          if(this.org_type == 1){
            params = {
              org_id_list : this.realData.company_ids.split(","),
              org_type:1,
            }
            group_type='company';
          }else{
            params = {
              org_id_list : this.realData.allCase_ids,
              org_type:2,
            }
            group_type='case';
          }

        }

        let url = '/sys/face_report/distribution_sum'
        url += '?group_type='+ group_type +'&tags=' + tags + '&indicator_key=face_total_enters'+
          '&start_day=' + this.realData.start_day + '&end_day=' + this.realData.end_day +
          '&start_hm=' + this.start_hm + '&end_hm=' + this.end_hm
        this.$api.post(url,params)
        .then(data=>{
          if(data == '10001'){
            this.rankTop8=[];
            this.loadingText = '无该指标权限';
            this.shake = false;
            return
          }
          if(data && data.data.sum_list){
            let sum_list = data.data.sum_list[0]
            let male_enters = sum_list.male_enters
            let female_enters = sum_list.female_enters
            this.male_enters = male_enters //男生人数
            this.female_enters = female_enters//女生人数
            this.male = Math.round(male_enters / (male_enters + female_enters) * 10000) / 100
            this.female = Math.round(female_enters / (male_enters + female_enters) * 10000) / 100
            this.$nextTick(()=>{
              this.loading = false;
            })
          }else{
            this.removeData();
            this.loadingText = '无数据';
          }
          this.shake = false
        })
        .catch(err=>{
           console.log(err);
          // this.$message.error('获取指标权限失败')
          this.$Bus.$emit('Loading', false)
          this.shake = false
        })
      },
      removeData(){
       this.male = ''
       this.female = ''
       this.male_enters = ''
       this.female_enters = ''
      },
    },
    watch: {
      GetData:{
        handler(val) {
          if(this.shake && val.index != 0){
            return
          }
          if (val) {
            this.realData = val.realHeaderData;
            this.global = val.global;
            this.org_type = val.org_type;
            this.loading = true;
            this.shake = true;
            if (!this.realData.company_ids.length) {
              this.removeData();
              this.loadingText = '无数据';
              this.shake = false
              return
            } else {
              this.loadingText = '加载中...';
              this.getData();
            }
          }
        },
        deep:true
      },

    },

  };
</script>
